.register {
  margin: 20px auto auto 32%;

  ::ng-deep .devui-form-vertical .devui-form-item {
    display: block;
  }

  .title {
    margin-bottom: 4px;
    width: 144px;
    height: 36px;
    font-size: 36px;
    font-family: Microsoft YaHei, Microsoft YaHei-Normal;
    font-weight: Normal;
    text-align: LEFT;
    color: #ffffff;
    line-height: 36px;
  }

  .registerMessage {
    ::ng-deep .devui-form-control-container {
      display: flex;
    }

    ::ng-deep .devui-form-item {
      margin-bottom: 0;
    }

    ::ng-deep .devui-form-label {
      padding-bottom: 0;
    }

    ::ng-deep .devui-form-span {
      display: flex;
      margin: 60px 0 24px 0;
      height: 16px;
      font-size: 16px;
      color: #ffffff;
      font-family: Microsoft YaHei, Microsoft YaHei-Normal;
      font-weight: Normal;
      text-align: LEFT;
      line-height: 16px;
    }

    ::ng-deep .devui-form-span::after {
      content: "*";
      display: inline-block;
      margin-left: 10px;
      width: 8px;
      height: 16px;
      font-size: 16px;
      font-family: Microsoft YaHei, Microsoft YaHei-Normal;
      font-weight: Normal;
      text-align: LEFT;
      color: #ff0000;
      line-height: 16px;
    }

    ::ng-deep .devui-form-span::before {
      content: none;
    }

    .password {
      ::ng-deep .devui-form-control-has-suffix .devui-form-item-suffix {
        bottom: 0;
        left: 700px;
      }
    }

    .authentiCode {
      width: 600px;
    }

    .codeImg {
      height: 40px;
      width: 100px;
      margin-left: 20px;
      cursor: pointer;
    }

    .phoneCode {
      ::ng-deep .devui-form-span::after {
        content: none;
      }
    }

    .phonePrefix {
      ::ng-deep .devui-form-span::after {
        content: none;
      }

      ::ng-deep .devui-form-control-has-suffix .devui-form-item-suffix {
        bottom: 0;
        left: 18px;
      }

      ::ng-deep .devui-select-underlined-border {
        border: none;
      }

      ::ng-deep :not(.multiple-label-auto-complete-disabled):not(.devui-error)>.devui-dropdown-origin:not(d-button):not(.icon):not([class^="icon-"]):not([disabled]):not(.disabled):not(.devui-disabled):not(.devui-dropdown-no-border):not(.devui-no-border) {
        border: none;
      }

      .prefix {
        ::ng-deep input.devui-form-control.devui-select-input {
          height: 40px;
          width: 70px;
          border: none;
          border-bottom: 1px solid #4a4b52;
          font-size: 14px;
        }

        ::ng-deep .devui-form-control {
          background-color: #0b0c11;
        }
      }

      .phoneNum {
        padding-left: 80px;
      }
    }

    input {
      padding: 0 0;
      display: flex;
      width: 720px;
      height: 40px;
      border-radius: 0px;
      font-size: 16px;
      font-family: Microsoft YaHei, Microsoft YaHei-Normal;
      font-weight: Normal;
      text-align: LEFT;
      color: #8e8f97;
      line-height: 20px;
      background: #0b0c11;
      border: none;
      border-bottom: 1px solid #4a4b52;
      outline: none;
    }

    .code {
      width: 560px;
    }

    ::ng-deep .devui-form-message {
      margin-top: 16px;
      height: 14px;
      opacity: 0.8;
      font-size: 14px;
      font-family: Microsoft YaHei, Microsoft YaHei-Normal;
      font-weight: Normal;
      text-align: LEFT;
      color: #ff0000;
      line-height: 14px;
    }

    input::-webkit-input-placeholder {
      color: #4a4b52;
    }

    ::ng-deep .devui-form-controls textarea:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus,
    [dTextInput]:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus,
    [dTextarea]:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus {
      border: none;
      border-bottom: 1px solid #4a4b52;
      outline: none;
    }

    ::ng-deep [dTextInput]:not([disabled]):not(.disabled):not(.devui-disabled).error,
    [dTextarea]:not([disabled]):not(.disabled):not(.devui-disabled).error,
    [dTextInput]:not([disabled]):not(.disabled):not(.devui-disabled).devui-error,
    [dTextarea]:not([disabled]):not(.disabled):not(.devui-disabled).devui-error {
      border: none;
      border-bottom: 1px solid rgba(255, 0, 0, 0.6);
      outline: none;
    }

    button {
      margin: 60px auto 166px auto;
      width: 720px;
      height: 50px;
      background: #ffffff;
      border: 1px solid rgba(255, 255, 255, 0.2);
      border-radius: 2px;
      font-size: 16px;
      font-family: Microsoft YaHei, Microsoft YaHei-Normal;
      font-weight: Normal;
      text-align: CENTER;
      color: #000000;
      line-height: 14px;
    }

    .getCode {
      margin: 0;
      margin-left: 20px;

      ::ng-deep button {
        width: 140px;
        height: 40px;
        border: 1px solid #4a4b52;
        border-radius: 2px;
        font-size: 14px;
        font-family: Microsoft YaHei, Microsoft YaHei-Normal;
        font-weight: Normal;
        text-align: CENTER;
        color: #8e8f97;
        line-height: 14px;
        background-color: #0b0c11;
      }

      ::ng-deep .devui-btn.devui-btn-primary:disabled {
        width: 140px;
        height: 40px;
        text-align: center;
        font-size: 14px;
        color: #4a4b52;
        background-color: #0b0c11;
        border: 1px solid #4a4b52;
        border-radius: 2px;
        line-height: 14px;
      }

      ::ng-deep button:hover {
        background-color: #131419;
      }
    }
  }
}
